<template>
	<view class="colle page bgf6" v-if="data != null">

		<view class="bgff flex flexC flexB px20 py16 borb  fs16">
			<text>用户头像</text>
			<view class="flex flexC" @click="chooseImage">
				<image class="r50 head" :src="data.avatar" mode="aspectFill"></image>
				<text class="arrowR dinline mt2"></text>
			</view>
		</view>


		<view class="bgff flex flexC flexB px20 py16 borb fs16">
			<text>手机号</text>
			<view class="flex flexC">

				<view>
					<text class="c8e px8">{{data.mobile}}</text>
				</view>
				<text class="arrowR dinline mt2"></text>
			</view>
		</view>
		
		<view class="bgff flex flexC flexB px20 py16 borb fs16">
			<text>姓名</text>
			<view class="flex flexC">
		
				<view>
					<text class="c8e px8">{{data.username}}</text>
				</view>
				<text class="arrowR dinline mt2"></text>
			</view>
		</view>
		

		<view class="bgff flex flexC flexB px20 py16 borb fs16">
			<text>实名状态</text>
			<view class="flex flexC">

				<view v-if="data.idcard != ''">
					<text class="c8e px8">{{data.idcard}}</text>
				</view>
				<view v-else>
					<text class="c8e px8">未实名</text>
				</view>
				
				<text class="arrowR dinline mt2"></text>
			</view>
		</view>
		
		<view class="bgff flex flexC flexB px20 py16 borb fs16">
			<text>银行卡</text>
			<view class="flex flexC" @click="addCard">
		
				<view v-if="data.card != null">
					<text class="c8e px8">{{data.card.card_num}}</text>
				</view>
				<view v-else>
					<text class="c8e px8">未添加储蓄卡</text>
				</view>
				
				<text class="arrowR dinline mt2"></text>
			</view>
		</view>
	



		<button @click="logout" hover-class="none" class="r40 bg41 m40 fs16 py16">退出登录</button>

	</view>
</template>

<script>
	export default {
		data() {
			return {

				data: null,
				frontUrl: '',
				frontPath: '',
				versionCode:''
			};
		},
		onLoad() {
		
		
		},
		onShow() {
			this.getDetail();
		},
		methods: {
			
			addCard(){
				
				if(this.data.card != null ){
					uni.showModal({
						title:"安全提示",
						content:"如需替换提现卡，请联系客服或者运营人员",
						showCancel:false,
						confirmText:"确定",
						complete(res) {
							
						}
					})
				}else{
					uni.navigateTo({
						url:'../member/addDeposit?name='+this.data.username
					})
				}
			
				
			
			},
			


			chooseImage() {

				let that = this;

				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ["camera", "album"], //从相册选择
					success: function(res) {
						console.log(JSON.stringify(res.tempFilePaths));

						uni.showLoading({
							title: "上传中"
						})
						console.info("===1===")
						let images = res.tempFilePaths; //非APP平台不支持自定义压缩,暂时没有处理,可通过uni-app上传组件的sizeType属性压缩
						for (var i = 0; i < images.length; i++) {
							let tImg = images[i];


							that.upload(tImg);
						}
					},
					fail(res) {
						console.info(res);
						uni.hideLoading();
					}
				});
			},

			upload(img) {

				let that = this;
				console.info("===2===" + img)
				uni.uploadFile({
					url: this.$uploadUrl, //仅为示例，非真实的接口地址
					filePath: img,
					name: 'file',
					success: (uploadFileRes) => {

						uni.hideLoading();
						var res = uploadFileRes.data;

						// 根据接口具体返回格式   赋值具体对应url
						var url = JSON.parse(res).data.fullurl;

						var uploadUrl = JSON.parse(res).data.url;

						that.frontPath = uploadUrl;
						that.frontUrl = url;
						that.data.avatar = url;
						that.updateAvatar();

					},
					fail() {
						uni.hideLoading();
					}
				});


			},

			logout() {


				let param = {}
				let that = this;
				this.$api.logout(param).then(res => {
					console.info(res);
					if (res.code == 1) {

						uni.removeStorageSync("token");
						uni.removeStorageSync("mobile");
						uni.removeStorageSync("selectShop");
						uni.removeStorageSync("role");
						uni.navigateTo({
							url: "/pages/user/login"
						})
					} else {

					}
				})
			},


			updateAvatar() {
				let param = {
					avatar: this.frontPath
				}
				let that = this;
				this.$api.updateAvatar(param).then(res => {
					console.info(res);
					if (res.code == 1) {
						uni.showToast({
							title: "修改成功",
							icon: 'success'
						});
					} else {

					}
				})

			},


			call() {
				var mobile = this.data.ref_mobile2;
				uni.makePhoneCall({
					phoneNumber: mobile
				})
			},

			doAddress() {
				console.info("===address==");
				uni.navigateTo({
					url: '../address/list'
				})
			},

			getDetail() {

				let param = {}
				let that = this;
				this.$api.userDetail(param).then(res => {
					console.info(res);
					if (res.code == 1) {
						that.data = res.data;
						if (that.data.avatar == '') {
							that.data.avatar = "/static/logo.jpeg"
						}
					} else {

					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.colle {
		
		.head{
			width: 90rpx;
			height: 90rpx;
		}
		.w20 {
			width: 80rpx;
			height: 80rpx;
		}

		.w28 {
			width: 56rpx;
		}

		.maxH {
			height: 60vh;
		}
	}
</style>
